<template>
    <div>
      <div class="mb-4">
        <input type="text" placeholder="标题" class="input input-bordered w-full">
      </div>
  
      <div class="mb-4">
        <Editor
          v-model="content"
          api-key="your-tinymce-api-key"
          :init="editorConfig"
        />
      </div>
  
      <div class="flex gap-4">
        <select class="select select-bordered" multiple>
          <option v-for="tag in tags" :key="tag">{{ tag }}</option>
        </select>
        <button class="btn btn-primary">保存</button>
      </div>
    </div>
  </template>
  
  <script setup>
  import Editor from '@tinymce/tinymce-vue'
  
  const content = ref('')
  const tags = ['技术', '生活', '随笔']
  
  const editorConfig = {
    height: 500,
    plugins: 'link image code table lists',
    toolbar:
      'undo redo | styleselect | bold italic | alignleft aligncenter alignright | bullist numlist | code',
    skin: 'oxide-dark',
    content_css: 'dark'
  }
  </script>